<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/webpage/include/taglib.jsp"%>
<html>
<head>
	<meta charset="utf-8">
	<title>实时库存统计</title>
	<meta name="decorator" content="ani"/>
	<!-- 引入 echarts.js -->
	<%@ include file="/webpage/include/echarts.jsp"%>
	<script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/echarts.min.js"></script>
       <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts-gl/echarts-gl.min.js"></script>
       <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts-stat/ecStat.min.js"></script>
       <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/extension/dataTool.min.js"></script>
       <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/map/js/china.js"></script>
       <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/map/js/world.js"></script>
       <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/extension/bmap.min.js"></script>
       <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/simplex.js"></script>
</head>
<body class="bg-white">
<!-- 为ECharts准备一个具备大小（宽高）的Dom -->
<div id="main" style="width: 100%;height: 100%"></div>
<script type="text/javascript">
// 基于准备好的dom，初始化echarts实例

var statisticsData=new Array();
	var sku;
	var childrens;
	var children;
	$.ajax({
	    url:"${ctx}/statistics/findSkuRealtimeInventory",
	    type:"post",	
	    
	    success:function(data){
	    	if(data != null && data != ''){
	    		for(var i=0;i<data.length;i++){
	    			sku = new Object();
	    			sku.name=data[i].name;
	    			statisticsData.push(sku);
	    			if(data[i].skuRealtimeInventoryList != null && data[i].skuRealtimeInventoryList != ''){
	    				var list=data[i].skuRealtimeInventoryList;
	    				childrens=new Array();
	    				for(var j=0;j<list.length;j++){
	    					children=new Object();    					
	    					children.name=list[j].name+"("+list[j].amount+")";
	    					children.value=list[j].amount;
	    					childrens.push(children);
	    					sku.children=childrens;
	    				}
	    			}
	    		}
	    		var myChart = echarts.init(document.getElementById('main'));

		    	// 指定图表的配置项和数据
		    	var option = {
		    	    title: {
		    	        text: 'sku实时库存',
		    	        //subtext: 'Source: https://worldcoffeeresearch.org/work/sensory-lexicon/',
		    	        textStyle: {
		    	            fontSize: 14,
		    	            align: 'center'
		    	        },
		    	        subtextStyle: {
		    	            align: 'center'
		    	        },
		    	        //sublink: 'https://worldcoffeeresearch.org/work/sensory-lexicon/'
		    	    },
		    	    series: {
		    	        type: 'sunburst',
		    	        highlightPolicy: 'ancestor',
		    	        data: statisticsData,
		    	        radius: [0, '95%'],
		    	        sort: null,
		    	        levels: [{}, {
		    	            r0: '15%',
		    	            r: '35%',
		    	            itemStyle: {
		    	                borderWidth: 2
		    	            },
		    	            label: {
		    	                rotate: 'tangential'
		    	            }
		    	        }, {
		    	            r0: '35%',
		    	            r: '100%',
		    	            label: {
		    	                align: 'right'
		    	            }
		    	        }, {
		    	            r0: '70%',
		    	            r: '72%',
		    	            label: {
		    	                position: 'outside',
		    	                padding: 3,
		    	                silent: false
		    	            },
		    	            itemStyle: {
		    	                borderWidth: 3
		    	            }
		    	        }]
		    	    }
		    	};

		    	// 使用刚指定的配置项和数据显示图表。
		    	myChart.setOption(option);
	    	}
	    	
	    	
	    }
	});
	



</script>
</body>
</html>